js数据类型检测的几种方法的原理及其优缺点 |
您所在的位置:网站首页 › js map类型数据 › js数据类型检测的几种方法的原理及其优缺点 |
js数据类型检测的几种方法的原理及其优缺点
在日常开发中总是会用到类型检测,今天就总结一下常用的类型检测方法 1.typeof (检测基本类型值) 1) 使用时直接 typeof 要检测的类型值,比如 2) typeof 可以检测 number、string、boolean、null、undefined、symbol、Bigint这些基本类型值。 3)对于引用类型只可以检测出object(包括不同对象、数组、正则、日期等等)、function 也就是说不管对象类型具体为什么类型都显示为 object比如: 4)关于typeof的一些细节: 返回的结果都是字符串,还有对于null的检测结果也为object 2.instanceof(可用来检测具体对象类型) 1)使用时 [要检测的数据] instanceof [要验证的对象类型]比如 2)返回一个boolean数据,来判断是否属于数据该类 3)原理就是通过原型链来判断实例的__proto__是否与检测类型的prototype一致,比如 可以看到数组检测object也为true,其实就是根据原型链循环的比对就像如下 4)关于instanceof的细节问题 instanceof无法检测基本类型值,比如一个number、string等,如下所示 除非是number类的实例 3.通过constructor 判断实例个类的关系 1)使用时就[要判断的类型值].constructor === [需要验证的类],比如 2)原理也是通过原型链,我们知道原型prototype上都有一个constructor属性指向其构造函数。所以实例获取constructor时,自身没有这个属性,向原型上找然后比对 3)问题也一样,无法判断基本类型值 4. 使用Object的toString方法来判断 1)使用时Object.prototype.toString.call(需要判断的值),比如 2)通过call来改变Object的toString方法的this指向,从而达到判断类型的效果 3)此方法即可以判断值类型,也可以判断引用类型值,比较常用 4)我们日常开发可以用这个方法封装一个工具方法来使用 123456789101112131415161718192021222324252627282930/** * @function isType 判断数据类型 * @param {*} data 需要检测的数据 * @param {*} type 期望数据类型 * @return {Boolean} 是否是期望数据类型 */ function isType(data, type) { const typeObj = { '[object String]': 'string', '[object Number]': 'number', '[object Boolean]': 'boolean', '[object Null]': 'null', '[object Undefined]': 'undefined', '[object Object]': 'object', '[object Array]': 'array', '[object Function]': 'function', '[object Date]': 'date', '[object RegExp]': 'regExp', '[object Map]': 'map', '[object Set]': 'set', '[object HTMLDivElement]': 'dom', '[object WeakMap]': 'weakMap', '[object Window]': 'window', '[object Error]': 'error', '[object Arguments]': 'arguments' }; const name = Object.prototype.toString.call(data); const typeName = typeObj[name] || 'Unknown Type'; return typeName === type; } |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |